<template>
	<view class="">
		<view class="title">
			<NavBar title="充值成功" :isShowLeftBtn="false">
			</NavBar>
		</view>
		<view class="content content_padding_bottom">
			<view class="row1 m_b_70">
				<view class="row1_row1">
					<view class="row1_row1_icon flex_center"
						style="width: 148rpx;height: 148rpx; border-radius:74rpx; background:#52C41A ;">
						<u-icon name="checkmark" color="#ffffff" size="62" :bold="true"></u-icon>
					</view>
				</view>
				<view class="row1_row2">
					充值成功
					<!-- <view>{{title11}}</view> -->
				</view>
				<view class="row1_row3">
					充值金额：<text class="m_r_12" style="color:  #F76D11;">{{oInfo.price}}元</text> 获得次数：<text
						class="m_r_12" style="color:  #F76D11;">{{oInfo.num}}次</text> 获得积分：<text
						style="color:  #F76D11;">{{oInfo.buy_reward}}</text>
				</view>

			</view>
			<view class="submit_btn" @click="toIndex">
				<text class="f_30_f">
					返回首页
				</text>
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	import { onLoad, onShow } from '@dcloudio/uni-app';
	import { ref, reactive, computed, getCurrentInstance } from 'vue';
	import NavBar from "@/components/navbar.vue"
	const oInfo = reactive({
		price: 0,
		num: 0,
		buy_reward:0
	})
	onLoad((e) => {
		console.log(e);
		oInfo.price = e.price
		oInfo.num = e.num
		oInfo.buy_reward = e.buy_reward
	})
	const toIndex = () => {
		uni.reLaunch({
			url: "/pages/index/index"
		})
	}
</script>


<style lang="scss">
	.content {
		background: #F7F8FC;
		padding: 32rpx 32rpx 0 32rpx;

		.row1 {
			.row1_row1 {
				display: flex;
				justify-content: center;
				margin-top: 50rpx;

				.row1_row1_icon {
					width: 148rpx;
					width: 148rpx;
				}
			}

			.row1_row2 {
				text-align: center;
				margin: 48rpx 0;
				font-size: 34rpx;
				font-weight: bold;
			}

			.row1_row3 {
				font-size: 26rpx;
				color: #999999;
				text-align: center;
			}
		}
	}

	.submit_btn {
		width: 684rpx;
		height: 96rpx;
		margin: 0 auto;
		background: #FD6C25;
		border-radius: 48rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>